import { Component, OnInit } from '@angular/core';
import { HttpService } from '../../service/http.service';
import { HttpRouterService } from '../../service/http-router.service';
import { StorageService } from '../../service/storage.service';
import { Router, ActivatedRoute } from '@angular/router';
import { CityData } from './city.data';
import _ from 'underscore';
declare var mui: any;

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.less']
})
export class HomeComponent implements OnInit {

  public step = '';

  public _cityList = [];
  public province = '';
  public isShow = false;
  public showProvince = '全国';

  public danList = [];
  public danProvince = '';
  public param = '';
  public yiqiang = false;

  public createOrderParam = '';
  public qiang = false;

  public page = 1;

  public showAdd = true;

  constructor(
    private _http: HttpService,
    private _router: Router,
    private _activatedRoute: ActivatedRoute,
    private _storage: StorageService,
    private _httpRouter: HttpRouterService
  ) { }

  ngOnInit() {
    this._activatedRoute.queryParams.subscribe(params => {
      this.param = params.param;
      if (this._storage.getSession('token')) {
        this.param = 'token=' + this._storage.getSession('token') + '&' + this.param;
      }
      this.getDanList(this.param);
    });
    this._cityList = CityData;
    mui.init({
      swipeBack: true
    });
  }

  // 城市选择框
  showChoose() {
    this.isShow = true;
  }

  // 选择城市
  checkProvince(id= '', name= '全国') {
    this.province = id;
    this.showProvince = name;
    this.isShow = false;
    this.danList = [];
    if (this.param === undefined) {
      this.param = 'province=' + this.province;
    } else if (this.param.lastIndexOf('province=') >= 0) {
      this.param = this.param.substring(0, this.param.length - 6) + this.province;
    }else {
      this.param = this.param + '&province=' + this.province;
    }
    this.getDanList(this.param);
  }

  // 展示订单
  getDanList(param) {
    this._http.post(this._httpRouter.danList, param).then(res => {
      if (res.code === 1) {
        if (res.data.length < 20) {
          this.showAdd = false;
        }
        this.danList = _.union(this.danList, res.data);
      }
    });
  }

  danDetail(danId) {
    this._storage.setSession('danId', danId);
    this._router.navigate(['/attache/order-details'], {queryParams: {isQiang: true}});
  }

  tips(danId, danMoney, $event) {
    $event.preventDefault();
    $event.stopPropagation();
    if ( !this._storage.getSession('token')) {
      this._router.navigate(['/attache/login']);
      return;
    } else if (this._storage.getSessionObject('user').verification === 1) {
      alert('请先实名认证！');
      return;
    }
    const btnArray = ['否', '是'];
    const that = this;
    mui.confirm('您确认要抢这个单子吗？', '抢单', btnArray, function(e) {
      if (e.index === 1) {
        that.createOrderParam = 'token=' + that._storage.getSession('token') +
                                '&customer_id=' + danId +
                                '&order_money=' + danMoney;
        that._http.post(that._httpRouter.createorder, that.createOrderParam).then( res => {
          if (res.code === 1) {

            _.map(that.danList, (item) => {
              if (item.id === danId) {
                item.buy = 'yes';
              }
              return item;
            });


            alert('抢单成功');
          }
        });
      } else {
        return;
      }
    });
  }

  more($event) {
    $event.preventDefault();
    if (this.param === undefined || this.param === null) {
      this.param = 'page=' + ++this.page;
    }else if (this.param.lastIndexOf('page=') >= 0) {
      this.param = this.param.substring(0, this.param.length - 1) + ++this.page;
    }else if (this.param.lastIndexOf('&page=') === -1) {
      this.param = this.param + '&page=' + ++this.page;
    }
    this.getDanList(this.param);
  }

}
